<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Document</title>
	<link rel="stylesheet" href="./bootstrap-3.3.7-dist/css/bootstrap.css">
</head>

<body>
	<div class="alert alert-warning alert-dismissible fade in" role="alertx">
		<button type="button" class="close" data-dismiss="alert" aria-label="Close">
			<span aria-hidden="true">&times;</span>
		</button>
		警告框
	</div>
	<script src="./jquery.js"></script>
	<script src="./bootstrap-3.3.7-dist/js/bootstrap.js"></script>
	<script>
		$(function () {
			$('[data-toggle="tooltip"]').tooltip()
		})
	</script>
	<button type="button" id="myStateButton" data-complete-text="finished!" class="btn btn-primary" autocomplete="off">
		...
	</button>

	<script>
		$('#myStateButton').on('click', function () {
			$(this).button('complete') // button text will be "finished!"
		})
	</script>
</body>

</html>